{% extends 'base/home_base.html' %}
{% load static %}
{% block title %}查看房间 {% endblock %}
{% block css %}
    <link rel="stylesheet" href="{% static 'font/css/baguetteBox.min.css' %}">
    <link rel="stylesheet" href="{% static 'font/css/thumbnail-gallery.css' %}">

    <style>
        .jq22-demo {
            text-align: center;
            margin-top: 30px;
        }

        .jq22-demo a {
            padding-left: 20px;
            padding-right: 20px;
        }
    </style>
{% endblock %}
{% block content %}

    <div class="htmleaf-container">
        <div class="container gallery-container">

            <h1>我的家电</h1>

            <p class="page-description text-center"></p>

            <div class="tz-gallery">
                <div class="row">
                    {% for field in query %}
                        <div class="col-xs-12">
                            <div class="thumbnail">
                                <a class="lightbox" href="media/{{ field.equ_img }}">
                                    <img src="media/{{ field.equ_img }}" alt="Park">
                                </a>
                                <div class="caption">
                                    <h3>名称：{{ field.get_name_display }}</h3>
                                    <h3>描述：{{ field.desc }}</h3>
                                    <h3>房间名称：{{ field.home }}</h3>
                                    <p><a href="{% url 'edit_equ' %}?equ_id={{ field.id }}"
                                          class="btn btn-primary">修改</a>
                                    <p><a href="{% url 'create_record' %}?equ_id={{ field.id }}"
                                          class="btn btn-danger">上报</a>
                                    </p>
                                </div>
                            </div>
                        </div>
                    {% endfor %}
                </div>

            </div>

        </div>

    </div>





{% endblock %}
{% block js %}
    <script type="text/javascript" src="{% static 'font/js/baguetteBox.min.js' %}"></script>
    <script type="text/javascript">
        baguetteBox.run('.tz-gallery');
    </script>


{% endblock %}